<!-- Copyright 2020 the V8 project authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file. -->

<head>
  <link href="./index.css" rel="stylesheet">
</head>
<style>
  .count {
    text-align: right;
    width: 5em;
  }

  .percentage {
    text-align: right;
    width: 5em;
  }

  .key {
    padding-left: 1em;
  }

  .drilldown-group-title {
    font-weight: bold;
    padding: 0.5em 0 0.2em 0;
  }

  .details {
    width: 0.1em;
  }

  .details span {
    padding: 0 0.4em 0 0.4em;
    background-color: var(--on-surface-color);
    color: var(--surface-color);
    border-radius: 25px;
    text-align: center;
    cursor: -webkit-zoom-in;
  }

  #legend {
    padding-right: 20px;
  }

  dl {
    float: right;
    border-style: solid;
    border-width: 1px;
    padding: 20px;
  }
</style>
<div class="panel">
  <h2>IC Panel</h2>
  <div id="legend">
    <dl>
      <dt>0</dt>
      <dd>uninitialized</dd>
      <dt>X</dt>
      <dd>no feedback</dd>
      <dt>1</dt>
      <dd>monomorphic</dd>
      <dt>^</dt>
      <dd>recompute handler</dd>
      <dt>P</dt>
      <dd>polymorphic</dd>
      <dt>N</dt>
      <dd>megamorphic</dd>
      <dt>G</dt>
      <dd>generic</dd>
    </dl>
  </div>
  <h3>Data</h3>
  <p>Trace Count: <span id="count">0</span></p>
  <h3>Result</h3>
  <p>
    Group-Key:
    <select id="group-key"></select>
  </p>
  <p>
    Filter by Time
    <input type="search" id="filter-time-start" placeholder="start"></input> :
    <input type="search" id="filter-time-end" placeholder="end"></input>
    <button id="filterICTimeBtn">Filter</button>
  <p>
  <table id="table" width="100%">
    <tbody id="table-body">
    </tbody>
  </table>
  </p>
</div>
